<script>
import menuItem from './components/menuItem.vue'
import city from '@/components/city.vue'
export default {
  components: {
    menuItem,
    city
  },
  data() {
    return {
      cityValue: "",
      lang: "",
      user_id: "",
      userInfo: {}
    }
  },
  created() {

  },
  onLoad(options) {
    var _this = this;
    document.addEventListener('UniAppJSBridgeReady', function () {
      console.log("UniAppJSBridgeReady!!!!!!!!!!!!!");
    })
    window.onNativeShow =  this.getUserInfo;
    this.getUserInfo()
  },
  methods: {
    getUserInfo() {
      uni.request({
        url: 'https://app.gluz.com.cn/api/user/getUserHomepage2',
        data: {
          user_id: uni.getStorageSync('user_id')
        },
        header: {
          "user_id": uni.getStorageSync('user_id'),
          'xzdToken': uni.getStorageSync('xzdToken'),
          'version': uni.getStorageSync('version'),
          'lang': uni.getStorageSync('lang'),
        },
        success: (res) => {
          console.log(res.data);
          this.userInfo = res.data.data.userInfo;
          uni.setStorageSync('userInfoFull', res.data.data.userInfo)
		  uni.setStorageSync('getUser', res.data.data)
        }
      });
    },
    empty() {
      uni.showToast({
        title: this.$t('暂未开放'),
        icon: 'none'
      })

    },
    go2(url) {
      uni.navigateTo({
        url: url
      })
    },
    log(e) {
      console.log(e);
    },
    card() {
      uni.navigateTo({
        url: '/pages/forwardingInformation/cardDetail?u_id=' + uni.getStorageSync('user_id')
      })
    }
  }
}
</script>

<template>
  <div class="h-full p-30 index-container" style="padding-top: 100rpx;">

    <div class="between">
      <div class="flex">
        <image :src="getImageUrl(userInfo.avatar)" mode="aspectFill" class="w-140 h-140 rounded-full flex-shrink-0">
        </image>
        <div class="flex-col ml-20" style="width: 430rpx;">
          <div class="fz30 font-bold ellipsis">
            {{ userInfo.username }}
          </div>
          <div class="flex mt-20">
            <!-- <div class="fz24 text-gray-1d">ID: {{ userInfo.id }}</div> -->
            <div class="fz24 role flex center flex-shrink-0">
              <image src="/static/icon/vip.png" mode="aspectFill" class="w-50 h-50"></image>
              {{$t('平台认证')}} · {{ userInfo.identity_name }}
            </div>
          </div>
        </div>
      </div>
      <image src="/static/icon/card.png" @click="card()" mode="aspectFit" class="w-50 h-50 ml-50"></image>
    </div>

    <div class="publish mb-30 mt-30 font-bold" @click="go2('/pages/publish/start')">
      <image src="/static/icon/publish.png" mode="aspectFit" class="w-100 h-100 mr-16"></image>
      {{$t('我要发货')}}
    </div>

    <div class="menus p-30  rounded-26">



      <div class="mb-50">
        <div class="menu-title">{{$t('营销线索')}}</div>
        <div class="flex mt-30">
          <menu-item icon="/static/icon/m1.png" bgColor="bg-orange" :title="$t('货源信息')"
            url="/pages/sourceInformation/index?id=1&a=2&c=3"></menu-item>

          <menu-item icon="/static/icon/m2.png" bgColor="bg-orange" :title="$t('车源信息')"
            url="/pages/vehicleSourceInformation/index"></menu-item>

            
          <menu-item icon="/static/icon/m2.png" bgColor="bg-orange" :title="$t('询单信息')"
            url="/pages/caigou/searchInformation/index" webview="zWebViewShop"></menu-item>

        </div>
      </div>

      <div class="mb-50">
        <div class="menu-title">{{$t('基础管理')}}</div>
        <div class="flex mt-30">
          <menu-item icon="/static/icon/m3.png" bgColor="bg-blue" :title="$t('我的车辆')"
            url="/pages/driverTask/driverList?isCar=1"></menu-item>
          <menu-item icon="/static/icon/m4.png" bgColor="bg-blue" :title="$t('员工管理')"
            url="/pages/employeeList/employeeList"></menu-item>
          <menu-item icon="/static/icon/m5.png" bgColor="bg-blue" :title="$t('仓库管理')"
            url="/pages/storeManage/storeManage"></menu-item>
          <menu-item icon="/static/icon/m6.png" bgColor="bg-blue" @click.native="empty()" :title="$t('经营数据')"></menu-item>
        </div>
      </div>

      <div class="mb-50">
        <div class="menu-title">{{$t('我的订单')}}</div>
        <div class="flex mt-30">
          <menu-item icon="/static/icon/m7.png" bgColor="bg-green" :title="$t('发货记录')"
            url="/pages/shipmentRecord/index"></menu-item>
          <menu-item icon="/static/icon/m8.png" bgColor="bg-green" :title="$t('我的报价')"
            url="/pages/freightOrder/index"></menu-item>
        </div>
      </div>

      <div class="mb-50">
        <div class="menu-title">{{$t('运踪管理')}}</div>
        <div class="flex mt-30">
          <menu-item icon="/static/icon/m9.png" bgColor="bg-yellow" url="/pages/freightOrder/index?status=2"
            :title="$t('创建运踪')"></menu-item>
          <menu-item icon="/static/icon/m10.png" bgColor="bg-yellow" url="/pages/freightOrder/index?status=3"
            :title="$t('运踪记录')"></menu-item>
          <menu-item icon="/static/icon/m11.png" bgColor="bg-yellow"
            url="/pages/freightOrder/index?status=3&goods_type=2" :title="$t('异常处理')"></menu-item>
        </div>
      </div>

    </div>

  </div>
</template>

<style>
.menu-title {
  font-weight: bold;
  color: #1d1d1d;
}

.role {
  background: linear-gradient(269.87deg, #FFFEFD -1.7%, #FFD392 99.89%);
  padding: 5rpx;
  padding-right: 20rpx;
  border-radius: 50rpx;
  color: #5D3800;
  font-weight: bold;
  /* margin-left: 24rpx; */
}

.index-container {
  background: #F6F7FB url("/static/bg/index.png") no-repeat top / 100%;
}

.publish {
  box-shadow: 0px 4px 20.5px 0px #9AD0FF94, 0px 4px 14.5px 0px #FFFFFF inset;
  width: 100%;
  height: 150rpx;
  border-radius: 26rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32rpx;
  color: #1D1D1D;
  background-color: rgba(255, 255, 255, 0.7);
}

.menus {
  box-shadow: 0rpx 4rpx 20.5rpx 0rpx #9AD0FF94, 0rpx 4rpx 14.5rpx 0rpx #FFFFFF inset;
  background-color: rgba(255, 255, 255, 0.7);
}

page {
  height: 100%;
}
</style>